<template>
	<div
		v-if="column.columnType === 'UAGRIDCOLUMN' && column.uIActionDetails"
		:class="classNames"
	>
		<div class="grid-column--ua">
			<template v-for="detail in column.uIActionDetails">
				<AppButton
					:key="detail.name"
					v-if="getActionShow(detail)"
					:disabled="getActionDisabled(detail)"
					@click.stop="handleButtonUIAction(detail, $event)"
					type="link"
				>
					<template v-if="detail.showIcon">
						<i v-if="detail.iconClass" :class="detail.iconClass"></i>
						<img v-if="detail.imgPath" :src="detail.imgPath" />
					</template>
					<span
						v-if="detail.showCaption"
						:title="detail.tooltip ? detail.tooltip : detail.caption"
						>{{ detail.caption }}</span
					>
				</AppButton>
			</template>
		</div>
	</div>
	<a
		v-else-if="column.uIAction"
		:style="{ display: 'block' }"
		@click.stop="handleUIAction($event)"
	>
		<AppGridColumnContent v-bind="$props" />
	</a>
	<a
		v-else-if="column.linkView"
		:style="{ display: 'block' }"
		@click.stop="handleLinkView($event)"
	>
		<AppGridColumnContent v-bind="$props" />
	</a>
	<AppGridColumnContent v-else v-bind="$props" />
</template>
<script setup lang="ts">
import { IParam, deepCopy } from '@/core';
import { gridColumnProps } from '../grid';
import AppGridColumnContent from './grid-column-content.vue';
import { handleEditorNavParams } from '@/hooks/use-editor';
const props = defineProps(gridColumnProps);
const emit = defineEmits<{
	(name: 'handleAction', detail: IParam, event: MouseEvent): void;
}>();
const { navContext, navViewParam } = handleEditorNavParams(props);
const classNames = computed(() => {
	const names = {};
	if (props.column.columnType === 'UAGRIDCOLUMN') {
		Object.assign(names, { 'grid-column--ua__content': true });
	}
	if (props.column.cellCssName) {
		Object.assign(names, { [props.column.cellCssName]: true });
	}
	return names;
});
const handleButtonUIAction = (detail: IParam, event: MouseEvent) => {
	emit('handleAction', detail, event);
};

const handleUIAction = (event: MouseEvent) => {
	if (props.column.uIAction) {
        emit('handleAction', props.column.uIAction, event);
    }
};

const handleLinkView = (event: MouseEvent) => {
	if (props.column.linkView) {
		// 参数处理
		let tempContext = deepCopy(props.context);
		let tempViewParams = deepCopy(props.viewParams);
		if (props.column.linkValueItem) {
			Object.assign(tempContext, {
				[`${props.column.linkViewDeKeyField}`]:
					props.record[`${props.column.linkValueItem}`],
			});
		}
		const view = App.getAppViewConfig()[`${props.column.linkView}`];
		if (view) {
			App.getOpenViewHelper().openPage(view, tempContext, tempViewParams);
		}
	}
};

const getActionShow = (detail: IParam) => {
	if (detail && detail.uIActionTag && props.record[detail.uIActionTag]) {
		return props.record[detail.uIActionTag].visible;
	}
	return true;
};

const getActionDisabled = (detail: IParam) => {
	if (detail && detail.uIActionTag && props.record[detail.uIActionTag]) {
		return props.record[detail.uIActionTag].disabled;
	}
	return false;
};
</script>
